<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <title>班级简历墙</title>
    <style>
        body {
            font-family: sans-serif;
            max-width: 960px;
            margin: 40px auto;
        }

        h1 {
            text-align: center;
        }

        .wall-container {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
            gap: 20px;
        }

        .resume-card {
            border: 1px solid #ddd;
            border-radius: 8px;
            padding: 15px;
            text-align: center;
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
            transition: transform 0.2s;
        }

        .resume-card:hover {
            transform: translateY(-5px);
        }

        .resume-card a {
            text-decoration: none;
            color: #007bff;
            font-weight: bold;
            font-size: 1.1em;
        }
    </style>
</head>

<body>
    <h1>班级简历墙</h1>
    <p style="text-align: center"><a href="/">返回上传页面</a></p>
    <hr>
    <div class="wall-container">
        {% if resumes %}
            {% for resume in resumes %}
            <div class="resume-card">
                <a href="/{{ resume }}" target="_blank">{{ resume.replace('.html', '') }}</a>
            </div>
            {% endfor %}
        {% else %}
            <p>还没有人上传简历哦！</p>
        {% endif %}
    </div>
</body>

</html>